import { createRouter, createWebHashHistory } from 'vue-router';
import Layout from '@/layouts/index.vue';
import i18n from '@/locales';
const { global } = i18n;
export const constantRoutes = [
  {
    path: '/login',
    name: 'Login',
    component: () => import('@/views/login/index.vue'),
    meta: {
      title: '登录',
    },
    hidden: true,
  },
  {
    path: '/401',
    name: '401',
    component: () => import('@/views/errorPage/401.vue'),
    hidden: true,
  },
  {
    path: '/404',
    name: '404',
    component: () => import('@/views/errorPage/404.vue'),
    hidden: true,
  },
];

export const asyncRoutes = [
  {
    path: '/',
    component: Layout,
    redirect: '/index',
    name: 'Root',
    children: [
      {
        path: '/index',
        name: 'Index',
        component: () => import('../views/index/index.vue'),
        meta: {
          title: global.t('route.home'),
          icon: 'icon-home',
          affix: true,
          noKeepAlive: true,
        },
      },
    ],
  },
  {
    path: '/event',
    component: Layout,
    name: 'Event',
    meta: { title: global.t('route.eventList'), icon: 'icon-code' },
    children: [
      {
        path: '/todaysPending',
        name: 'todaysPending',
        component: () => import('@/views/event/todaysPending.vue'),
        meta: {
          title: global.t('route.todaysPending'),
          icon: 'icon-code',
        },
      },
      {
        path: '/processedToday',
        name: 'processedToday',
        component: () => import('@/views/event/processedToday.vue'),
        meta: {
          title: global.t('route.processedToday'),
          icon: 'icon-like',
        },
      },
      {
        path: '/knottyEvent',
        name: 'knottyEvent',
        component: () => import('@/views/event/knottyEvent.vue'),
        meta: {
          title: global.t('route.knottyEvent'),
          icon: 'icon-like',
        },
      },
      {
        path: '/historicalEvent',
        name: 'historicalEvent',
        component: () => import('@/views/event/historicalEvent.vue'),
        meta: {
          title: global.t('route.historicalEvent'),
          icon: 'icon-like',
        },
      },
      {
        path: '/eventType',
        name: 'eventType',
        component: () => import('@/views/event/eventType.vue'),
        meta: {
          title: global.t('route.eventType'),
          icon: 'icon-like',
        },
      },
      {
        path: '/eventTag',
        name: 'eventTag',
        component: () => import('@/views/event/eventTag.vue'),
        meta: {
          title: global.t('route.eventTag'),
          icon: 'icon-like',
        },
      },
    ],
  },
  // {
  //   path: '/comp',
  //   component: Layout,
  //   name: 'Comp',
  //   meta: { title: global.t('route.components'), icon: 'icon-code' },
  //   children: [
  //     {
  //       path: '/element',
  //       name: 'ElementComp',
  //       component: () => import('@/views/element/index.vue'),
  //       meta: {
  //         title: global.t('route.eleComponents'),
  //         icon: 'icon-code',
  //       },
  //     },
  //     {
  //       path: '/iconPark',
  //       name: 'IconPark',
  //       component: () => import('@/views/icon/index.vue'),
  //       meta: {
  //         title: global.t('route.icons'),
  //         icon: 'icon-like',
  //       },
  //     },
  //     {
  //       path: '/chart',
  //       name: 'Chart',
  //       component: () => import('@/views/echarts/index.vue'),
  //       meta: {
  //         title: global.t('route.charts'),
  //         icon: 'icon-chart-line',
  //       },
  //       children: [
  //         {
  //           path: '/line',
  //           name: 'Line',
  //           component: () => import('@/views/echarts/line.vue'),
  //           meta: {
  //             title: global.t('route.lineChart'),
  //           },
  //         },
  //         {
  //           path: '/bar',
  //           name: 'Bar',
  //           component: () => import('@/views/echarts/bar.vue'),
  //           meta: {
  //             title: global.t('route.barChart'),
  //           },
  //         },
  //         {
  //           path: '/otherChart',
  //           name: 'OtherChart',
  //           component: () => import('@/views/echarts/other.vue'),
  //           meta: {
  //             title: global.t('route.mixedChart'),
  //           },
  //         },
  //       ],
  //     },
  //   ],
  // },
  {
    path: '/errorPage',
    name: 'ErrorPage',
    component: Layout,
    meta: {
      title: global.t('route.errorPages'),
      icon: 'icon-link-cloud-faild',
    },
    children: [
      {
        path: '/404Page',
        name: '404Page',
        component: () => import('@/views/errorPage/404.vue'),
        meta: {
          title: global.t('route.page404'),
          icon: 'icon-link-cloud-faild',
        },
      },
      {
        path: '/401Page',
        name: '401Page',
        component: () => import('@/views/errorPage/401.vue'),
        meta: {
          title: global.t('route.page401'),
          icon: 'icon-link-interrupt',
        },
      },
    ],
  },
  // {
  //   path: '*',
  //   redirect: '/404',
  //   hidden: true,
  // },
];

const router = createRouter({
  history: createWebHashHistory(),
  routes: constantRoutes,
});

// reset router
export function resetRouter () {
  router.getRoutes().forEach((route) => {
    const { name } = route;
    if (name) {
      router.hasRoute(name) && router.removeRoute(name);
    }
  });
}

export default router;
